{% extends 'base_two.html' %}
{% load static %}
{% block content %}


			<div class="pull-right">
				<div class="user-content__box clearfix bgf">
					<div class="title">账户信息-个人资料</div>
					<div class="port b-r50" id="crop-avatar">
						<div class="img"><img src="{% static 'images/icons/default_avt.png' %}" class="cover b-r50"></div>
					</div>
					<form action="{% url 'account_info:udai_setting' %}" class="user-setting__form" role="form" method="post">
                    {% csrf_token %}
						<div class="user-form-group">
							<label for="user-id">用户名：</label>
							<input type="text" id="user-id" value="{{ user_info.name }}" placeholder="请输入您的昵称" name="username">
						</div>
						<div class="user-form-group">
							<label>等级：</label>
                            {% if user.user_grade == '0'%}
                                普通会员 <a href="agent_level.html">提升</a>
                            {% elif user.user_grade == '1' %}
                                白银用户 <a href="agent_level.html">提升</a>
                            {% elif user.user_grade == '2' %}
                                黄金用户 <a href="agent_level.html">提升</a>
                            {% elif user.user_grade == '3' %}
                                钻石用户 <a href="agent_level.html">提升</a>
                            {% endif %}

						</div>
						<div class="user-form-group">
							<label>性别：</label>
                            {% if user_info.sex == '0'%}
                                <label><input type="radio" name="sex" value="0" checked><i class="iconfont icon-radio"></i> 男士</label>
							    <label><input type="radio" name="sex" value="1"><i class="iconfont icon-radio"></i> 女士</label>
							    <label><input type="radio" name="sex" value="2"><i class="iconfont icon-radio"></i> 保密</label>
                            {% elif user_info.sex == '1' %}
                                <label><input type="radio" name="sex" value="0"><i class="iconfont icon-radio"></i> 男士</label>
							    <label><input type="radio" name="sex" value="1" checked><i class="iconfont icon-radio"></i> 女士</label>
							    <label><input type="radio" name="sex" value="2"><i class="iconfont icon-radio"></i> 保密</label>
                            {% else %}
                                <label><input type="radio" name="sex" value="0"><i class="iconfont icon-radio"></i> 男士</label>
							    <label><input type="radio" name="sex" value="1"><i class="iconfont icon-radio"></i> 女士</label>
							    <label><input type="radio" name="sex" value="2"  checked><i class="iconfont icon-radio"></i> 保密</label>
                            {% endif %}

						</div>
						<div class="user-form-group">
							<label>生日：</label>
							<label><input type="text" class="datepicker" value="{{ birthday }}" placeholder="请选择您的出生日期" name="birthday"></label>
						</div>
						<div class="user-form-group">
							<button type="submit" class="btn">确认修改</button>
						</div>
					</form>
					<script src="{% static 'js/zebra.datepicker.min.js' %}"></script>
					<link rel="stylesheet" href="{% static 'css/zebra.datepicker.css' %}">
					<script>
						$('input.datepicker').Zebra_DatePicker({
							default_position: 'below',
							show_clear_date: false,
							show_select_today: false,
						});
					</script>
				</div>
			</div>
		</section>
	</div>
	<!-- 头像选择模态框 -->
	<link href="{% static 'css/cropper/cropper.min.css' %}" rel="stylesheet">
	<link href="{% static 'css/cropper/sitelogo.css' %}" rel="stylesheet">
	<script src="{% static 'js/cropper/cropper.min.js' %}"></script>
	<script src="{% static 'js/cropper/sitelogo.js' %}"></script>
	<div class="modal fade" id="avatar-modal" aria-hidden="true" aria-labelledby="avatar-modal-label" role="dialog" tabindex="-1">
		<div class="modal-dialog modal-lg">
			<div class="modal-content">
				<form class="avatar-form" action="" enctype="multipart/form-data" method="post">
					<div class="modal-header">
						<button class="close" data-dismiss="modal" type="button">&times;</button>
						<h4 class="modal-title" id="avatar-modal-label">Change Logo Picture</h4>
					</div>
					<div class="modal-body">
						<div class="avatar-body">
							<div class="avatar-upload">
								<input class="avatar-src" name="avatar_src" type="hidden">
								<input class="avatar-data" name="avatar_data" type="hidden">
								<label for="avatarInput">图片上传</label>
								<input class="avatar-input" id="avatarInput" name="avatar_file" type="file"></div>
							<div class="row">
								<div class="col-md-9">
									<div class="avatar-wrapper"></div>
								</div>
								<div class="col-md-3">
									<div class="avatar-preview preview-lg"></div>
									<div class="avatar-preview preview-md"></div>
									<div class="avatar-preview preview-sm"></div>
								</div>
							</div>
							<div class="row avatar-btns">
								<div class="col-md-9">
									<div class="btn-group">
										<button class="btn" data-method="rotate" data-option="-90" type="button" title="Rotate -90 degrees"><i class="fa fa-undo"></i> 向左旋转</button>
									</div>
									<div class="btn-group">
										<button class="btn" data-method="rotate" data-option="90" type="button" title="Rotate 90 degrees"><i class="fa fa-repeat"></i> 向右旋转</button>
									</div>
								</div>
								<div class="col-md-3">
									<button class="btn btn-success btn-block avatar-save" type="submit"><i class="fa fa-save"></i> 保存修改</button>
								</div>
							</div>
						</div>
					</div>
				</form>
			</div>
		</div>
	</div>
	<div class="loading" aria-label="Loading" role="img" tabindex="-1"></div>
	<!-- 右侧菜单 -->
	<div class="right-nav">
		<ul class="r-with-gotop">
			<li class="r-toolbar-item">
				<a href="udai_welcome.html" class="r-item-hd">
					<i class="iconfont icon-user" data-badge="0"></i>
					<div class="r-tip__box"><span class="r-tip-text">用户中心</span></div>
				</a>
			</li>
			<li class="r-toolbar-item">
				<a href="udai_shopcart.html" class="r-item-hd">
					<i class="iconfont icon-cart"></i>
					<div class="r-tip__box"><span class="r-tip-text">购物车</span></div>
				</a>
			</li>
			<li class="r-toolbar-item">
				<a href="udai_collection.html" class="r-item-hd">
					<i class="iconfont icon-aixin"></i>
					<div class="r-tip__box"><span class="r-tip-text">我的收藏</span></div>
				</a>
			</li>
			<li class="r-toolbar-item">
				<a href="" class="r-item-hd">
					<i class="iconfont icon-liaotian"></i>
					<div class="r-tip__box"><span class="r-tip-text">联系客服</span></div>
				</a>
			</li>
			<li class="r-toolbar-item">
				<a href="issues.html" class="r-item-hd">
					<i class="iconfont icon-liuyan"></i>
					<div class="r-tip__box"><span class="r-tip-text">留言反馈</span></div>
				</a>
			</li>
			<li class="r-toolbar-item to-top">
				<i class="iconfont icon-top"></i>
				<div class="r-tip__box"><span class="r-tip-text">返回顶部</span></div>
			</li>
		</ul>
		<script>
			$(document).ready(function(){ $('.to-top').toTop({position:false}) });
		</script>
	</div>

{% endblock %}